<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>我的工作台</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="manifest" href="site.webmanifest">
    <link rel="apple-touch-icon" href="icon.png">
    <link rel="stylesheet" href="./plugs/layui/css/layui.css">
    <link rel="stylesheet" href="./font/font_399822_n4n5dhe4b7ta9k9/iconfont.css">
    <link rel="stylesheet" href="css/myWorkSpace/main.css">
    <link rel="stylesheet" href="css/myWorkSpace/left-nav.css">
    <link rel="stylesheet" href="css/myWorkSpace/header.css">
    <link rel="stylesheet" href="css/myWorkSpace/main-content.css">
    <link rel="stylesheet" href="./css/myworkspace-option.css">
    <link rel="stylesheet" href="./css/module-title.css">
    <link rel="stylesheet" href="./css/myworkspace-store.css">
    <link rel="stylesheet" href="./css/count-data.css">
    <link rel="stylesheet" href="./css/data-Echart.css">
    <link rel="stylesheet" href="./css/product-list.css">
</head>
<body>
    <div class="main container">
        <!--左侧导航栏开始-->
        <div class="layui-left-nav" id="leftNavList">

        </div>
        <!--左侧导航栏结束-->
        <!--右侧内容区域开始-->
        <div class="layui-right-content">
            <!--右侧头部导航开始-->
            <div class="layui-header ">
                <div class="layui-header-left layui-col-lg2 layui-col-md3 layui-col-sm3">
                    <ul class="layui-nav">
                        <li class="layui-nav-item">
                            <i class="iconfont">&#xe607;</i>
                            <a href="javasript:;" class="">13557155397</a>
                            <dl class="layui-nav-child">
                                <dd><a href="javascript:;">修改信息</a></dd>
                                <dd><a href="javascript:;">安全管理</a></dd>
                                <dd><a href="javascript:;">退出登录</a></dd>
                            </dl>
                        </li>
                    </ul>
                </div>
                <div class="layui-header-right  layui-col-lg10 layui-col-md9 layui-col-sm9" id="headerRight">

                </div>
            </div>
            <!--右侧头部导航结束-->
            <!--右侧主体内容开始-->
            <div class="layui-main-content">
                <div class="layui-option">
                    <div class="layui-data-option layui-form">
                        <div class="layui-user-center layui-inline">
                            <select name="city" lay-verify="">
                                <option value="">个人中心</option>
                                <option value="010">修改密码</option>
                                <option value="021">系统消息</option>
                            </select>
                        </div>

                        <div class="layui-shoping-center layui-inline">
                            <select name="city" lay-verify="">
                                <option value="">我要采购</option>
                            </select>
                        </div>
                        <div class="layui-account-seting layui-inline">
                            <select name="city" lay-verify="">
                                <option value="">账户设置</option>
                                <option value="010">退出登录</option>
                                <option value="021">切换账号</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-module-title">
                    <h3>我的工作台</h3>
                </div>
                <div class="layui-store layui-row layui-col-space10">
                    <div class="layui-store-info layui-col-lg4 layui-col-md4 layui-col-sm4">
                        <div class="layui-store-name-type">
                            <a href="javascript:;">
                                <img src="./img/meiyijia.jpg" alt="" class="layui-store-img">
                            </a>
                            <div class="layui-store-dec">
                                <p class="layui-store-dec-name">美宜佳日用品店</p>
                                <p class="layui-store-dec-type">用户类型：</p>
                                <p class="layui-store-dec-business">经营范围：食品、粮油制品、熟食制品、鲜肉、水产品、禽蛋、蔬菜、水果</p>
                            </div>
                        </div>
                    </div>
                    <div class="layui-store-info layui-col-lg4 layui-col-md4 layui-col-sm4">
                        <div class="layui-store-order" id="storeOrder">

                        </div>
                    </div>
                    <div class="layui-store-info layui-col-lg4 layui-col-md4 layui-col-sm4">
                        <div class="layui-store-achievement">
                            <div class="layui-store-achievement-data">
                                <div class="layui-store-achievement-data-all">
                                    <p>￥<span>9800.00</span></p>
                                    <p>全部余额</p>
                                </div>
                                <div class="layui-store-achievement-data-locked">
                                    <p>￥<span>6500.00</span></p>
                                    <p>锁定余额</p>
                                </div>
                            </div>
                            <div class="layui-store-achievement-channel">
                                <div class="layui-store-achievement-order">
                                    <i class="iconfont">&#xe6ce;</i>
                                    <span>银行卡：</span>
                                    <span class="layui-store-card">5</span>
                                    <a href="javascript:;">管理</a>
                                </div>
                                <div class="layui-store-achievement-oprate">
                                    <button class="layui-btn layui-btn layui-btn-small">充值</button>
                                    <button class="layui-btn layui-btn layui-btn-small">转账</button>
                                    <button class="layui-btn layui-btn layui-btn-small">提现</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-count-data" id="countData">
                </div>
                <div class="layui-data-Echart layui-row layui-col-space20">
                    <div class="layui-data-Echart-bar layui-col-lg6 layui-col-md6 layui-col-sm6 layui-col-xs12">
                        <div class="layui-data-Echart-databar" id="eChartBar">

                        </div>
                    </div>
                    <div class="layui-data-Echart-pie layui-col-lg6 layui-col-md6 layui-col-sm6 layui-col-xs12">
                        <div class="layui-data-Echart-datapie" id="eChartPie">

                        </div>
                    </div>
                </div>
                <div class="layui-module-title">
                    <h3>我连推荐</h3>
                </div>
                <div class="layui-product" id="products">
                </div>
            </div>
            <!--右侧主体内容结束-->
        </div>
        <!--右侧内容区域结束-->
    </div>


    <script src="./js/jquery-3.2.1.min.js"></script>
    <script src="./plugs/jquery-slimscroll/jquery.slimscroll.min.js"></script>
    <script src="./plugs/layui/layui.js"></script>
    <script src="./plugs/echart/echarts.min.js"></script>
    <script src="js/plugins.js"></script>
    <script src="js/main.js"></script>
    <script src="https://www.google-analytics.com/analytics.js" async defer></script>
    <script src="./js/data-bar.js"></script>
    <script src="./js/data-pie.js"></script>
    <script type="text/html" id="leftNav">
        <ul class="layui-nav layui-nav-tree layui-nav-side">
            {{# layui.each(d,function(index,item){ }}
            <li class="layui-nav-item">
                <a href="javasript:;">
                    <i class="layui-icon iconfont"> {{ item.icon }} </i>
                    <span> {{ item.title }} </span>
                </a>
                {{# if(item.child){ }}
                <dl class="layui-nav-child">
                    <dt>{{ item.title }}</dt>
                    {{# layui.each(item.child,function(index1,item1){ }}
                    <dd><a href="#"> {{ item1.title }} </a> </dd>
                    {{# }) }}
                </dl>
                {{# } }}
            </li>
            {{# }); }}
        </ul>
    </script>
    <script type="text/html" id="headerNav">
        <ul class="layui-nav layui-layout-right">
            {{# layui.each(d, function(index,item){ }}
            <li class="layui-nav-item">
                <i class="iconfont"> {{  item.icon }} </i>
                <a href="javascript:;" class="">
                     {{ item.title }}
                </a>
                {{# if(item.child){ }}
                <dl class="layui-nav-child">
                    {{# layui.each(item.child, function(index1,item1){ }}
                    <dd>
                        <a href="javascript:;"> {{ item1.title }} </a>
                    </dd>
                    {{# }) }}
                </dl>
                {{# } }}
            </li>
            {{# }); }}
        </ul>
    </script>

    <script type="text/html" id="storeOrderList">
        <ul>
            {{# layui.each(d,function(index, item){ }}
            <li>
                <i class="iconfont layui-store-order-icon"> {{ item.icon }} </i>
                <div class="layui-order-detail">
                    <p class="layui-store-order-name"> {{ item.type }} </p>
                    <p class="layui-store-order-number"> {{ item.number }} </p>
                </div>
            </li>
            {{# }) }}
        </ul>
    </script>
    <script type="text/html" id="countDataList">
        <ul class="layui-count-data-container layui-clear layui-row layui-col-space10">
            {{# layui.each(d,function(index,item){  }}

            <li class="layui-col-lg3 layui-col-md3 layui-col-sm6 layui-col-xs12">
                <div class="layui-background-area">
                    <p class="layui-count-data-type">{{ item.type }}</p>
                    <div class="layui-count-data-number">
                        <div class="layui-count-data-money">
                            <p class="layui-count-data-curmoney">{{ item.money }}</p>
                            <p class="layui-count-data-title">采购金额</p>
                        </div>
                        <div class="layui-count-data-order">
                            <p class="layui-count-data-curorder">{{ item.order }}</p>
                            <p class="layui-count-data-title">订单数量</p>
                        </div>
                    </div>
                </div>
            </li>
            {{# }) }}
        </ul>
    </script>
    <script type="text/html" id="productList">
        <ul class="layui-product-list layui-clear layui-row layui-col-space10">
            {{# layui.each(d,function(index,item){ }}
            <li class="layui-col-lg2 layui-col-md3 layui-col-sm4 layui-col-xs6">
                <div class="layui-product-container">
                    <div class="layui-product-img">
                        <a href={{ item.href }}>
                            <img src={{ item.img }} alt="">
                            <div class="layui-product-info">
                                <p class="layui-product-store"> {{ item.store }} </p>
                                <p class="layui-product-produt-address"> {{ item.address }} </p>
                            </div>
                        </a>
                    </div>
                    <div class="layui-product-allprice">
                        <span class="layui-product-price">￥ {{ item.price }} </span>
                        <span class="layui-product-transport">包邮</span>
                    </div>
                    <div class="layui-product-dec">
                        <a href={{ item.href }} title={{ item.productDec }}> {{ item.productDec }} </a>
                    </div>
                    <div class="layui-product-oprate layui-row">
                        <div class="layui-col-xs4">
                            <input type="checkbox"><span>搬家</span>

                        </div>
                        <div class="layui-col-xs4">
                            <i class="iconfont">&#xe618;</i>
                            <span>关注</span>
                        </div>
                        <div class="layui-col-xs4">
                            <i class="iconfont">&#xe600;</i>
                            <span>购物车</span>
                        </div>
                    </div>
                </div>
            </li>
            {{# }) }}
        </ul>
    </script>

        <script>

            layui.use(['jquery','element','form'],function () {
                var form=layui.form;
                var element=layui.element;
                var $=layui.$;


                var getLeftNav=function () {
                    $.getJSON("./json/nav.json",function (navList) {
                        var getTpl=leftNav.innerHTML;
                        var navHtml=document.getElementById("leftNavList")
                        layui.use("laytpl",function () {
                            layui.laytpl(getTpl).render(navList, function (html) {
                                navHtml.innerHTML=html
                            })
                        })
                    })
                }
                getLeftNav()
                var getHeaderNav=function () {
                    $.getJSON("./json/headerNav.json",function (headerNavData) {
                        var getTpl=headerNav.innerHTML;
                        var headerHtml=document.getElementById("headerRight")
                        layui.use("laytpl",function () {
                            layui.laytpl(getTpl).render(headerNavData, function (html) {
                                headerHtml.innerHTML=html
                                element.init();

                            })
                        })
                    })
                }
                getHeaderNav()
                var getStoreOrder=function () {
                    $.getJSON("./json/order-list.json",function (orderList) {
                        var getTpl=storeOrderList.innerHTML;
                        var orderHtml=document.getElementById("storeOrder")
                        layui.use(["laytpl","element"],function () {
                            layui.laytpl(getTpl).render(orderList, function (html) {
                                orderHtml.innerHTML=html
                            })
                        })
                    })
                }
                getStoreOrder()
                var getCountData=function () {
                    $.getJSON("./json/count-data.json",function (countData) {
                        var getTpl=countDataList.innerHTML;
                        var countHtml=document.getElementById("countData")
                        layui.use("laytpl",function () {
                            layui.laytpl(getTpl).render(countData, function (html) {
                                countHtml.innerHTML=html
                            })
                        })
                    })
                }
                getCountData()

                var getProductList=function () {
                    $.getJSON("./json/product-list.json",function (countData) {
                        var getTpl=productList.innerHTML;
                        var countHtml=document.getElementById("products")
                        layui.use("laytpl",function () {
                            layui.laytpl(getTpl).render(countData, function (html) {
                                countHtml.innerHTML=html
                            })
                        })
                    })
                }
                getProductList()




        })
    </script>
</body>
</html>
